<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
	<title>测试</title>
	<style type="text/css">
		html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
			margin: 0;
			padding: 0;
			border: 0;
			outline: 0;
		}

		article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
			display: block;
			clear: all;
		}

		ul, menu, dir {
			display: block;
			list-style-type: disc;
			-webkit-margin-before: 1em;
			-webkit-margin-after: 1em;
			-webkit-margin-start: 0px;
			-webkit-margin-end: 0px;
			-webkit-padding-start: 40px;
		}

		ul, ol {
			list-style: none outside none;
		}

		html {
			font-family: Microsoft YaHei,Helvetica Neue,Helvetica,Roboto,STHeiTi,Arial,sans-serif;
			-ms-text-size-adjust: 100%;
			-webkit-text-size-adjust: 100%;
			font-size: 62.5%;
			line-height: 1.5;
		}

		body {
			font-family: 'XinGothic-SinaWeibo','Microsoft YaHei',helvetica,arial,sans-serif;
			-webkit-text-size-adjust: none;
			color: #1a1a1a;
			background: #f9f9f9;
			-webkit-text-size-adjust: none;
			min-width: 320px;
			font-size: 16px;
		}

		body {
			font-size: 16px;
			overflow-x: hidden;
			min-width: 320px;
			color: #1a1a1a;
			background: #f9f9f9;
			position: relative;
		}

		.layer_barrage {
			position:fixed;
			bottom:135px;
			width:100%
		}

		.layer_barrage ul {
			display:box;
			display:-webkit-box;
			display:-moz-box;
			display:-ms-box;
			margin-bottom:20px
		}

		.layer_barrage ul li {
			transform:translateX(0px)
		}

		.layer_barrage ul:nth-child(even) {
			padding-left:20px
		}

		.layer_barrage li {
			font-size:12px;
			margin-right:28px;
			padding-right:20px;
			color:rgba(255,255,255,.9);
			display:block;
			white-space:nowrap;
			text-overflow:ellipsis;
			height:22px;
			line-height:22px;
			background:rgba(0,0,0,0.68);
			border-radius:11px;
			transform:translateX(0px);
			z-index:15
		}

		.layer_barrage img:first-child {
			width:18px;
			height:18px;
			border-radius:50%;
			margin:-2px 6px 0 2px
		}

		.layer_barrage .active {
			background:rgba(20,185,148,0.9)
		}
		.hide{ display: none!important; }
		.show{ display: block!important; }
		.foot_barr { margin:0 24px 0 0;width: 23px;height: 26px;line-height: 26px;text-align: center;color: #FFFFFF;background: #666666;cursor: pointer; }
		.foot_barr_active { color: #FFFFFF;background: #FF0000; }
	</style>
</head>
<body>
	<script type="text/javascript" src="addjs.js" data-config="config.js"></script>
	<script type="text/javascript" src="zepto.js"></script>
	<div class="foot_barr" data-sudaclick="barrage_bar">弹</div>
	<!-- 弹幕浮层 -->
	<section class="layer_barrage hide j_barrage" data-sudaclick="barrage_reply">
		<ul>
		</ul>
	</section>
	<input type="hidden" name="barrage" value="barrage.json">
	<script type="text/javascript">
		// TODO::
		addjs.js("barrage.js");
	</script>
</body>
</html>